import { ref, reactive } from 'vue'
// import { getDeptTreeById } from '@/api/org-manage/depart-manage/index.js'

const roleOptions = ref()
const departmentOptions = ref([])
// const dataPermission = ref([
//   {
//     label: '查看所有部门数据',
//     value: 1
//   },
//   {
//     label: '查看本部门及子部门',
//     value: 2
//   },
//   {
//     label: '查看本部门数据',
//     value: 3
//   }
//
// ])

export const form = reactive({
  userForm: {
    realname: null,
    deptId: null,
    mobile: null,
    roleId: null,
    username: null,
    dataPermission: null,
    note: null,
    clientId: '1,2'
  },
  userRules: {
    realname: [{ required: true, message: '请输入员工姓名', trigger: 'blur' }],
    // deptId: [{ required: true, message: '请选择所属部门', trigger: 'blur' }],
    mobile: [{ required: true, message: '请输入正确的手机号码', pattern: /^(0|86|17951)?(13[0-9]|15[012356789]|166|17[3678]|18[0-9]|14[57])[0-9]{8}$/, trigger: 'blur' }],
    roleId: [{ required: true, type: 'number', message: '请选择角色', trigger: 'blur' }],
    // dataPermission: [{ required: true, type: 'number', message: '请选择数据权限', trigger: 'blur' }],
    username: [{ required: true, message: '请输入员工账号', trigger: 'blur' }]
  },
  formItem: [
    { type: 'input', key: 'realname', label: '员工姓名', props: { maxlength: '20', placeholder: '请输入员工姓名', clearable: true }},
    // { type: 'tree-select', key: 'deptId', label: '所属部门', props: { options: departmentOptions, labelField: 'name', keyField: 'id', placeholder: '请选择所属部门' }},
    { type: 'input', key: 'mobile', label: '手机号码', props: { maxlength: '11', placeholder: '请输入手机号码', clearable: true }},
    { type: 'select', key: 'roleId', label: '角色', props: { options: roleOptions, placeholder: '请选择角色' }},
    // { type: 'select', key: 'dataPermission', label: '数据权限', props: { options: dataPermission, placeholder: '请选择数据权限' }},
    { type: 'input', key: 'username', label: '员工账号', props: { maxlength: '20', placeholder: '请输入员工账号', notEdit: true, clearable: true }},
    { type: 'input', key: 'note', label: '备注', props: { type: 'textarea', maxlength: '140', autosize: { minRows: 3, maxRows: 3 }, placeholder: '请输入备注', clearable: true }}
  ]
})

export const setRoletOptions = async function(value) {
  value.forEach((item) => {
    item.label = item.roleName
    item.value = item.id
  })
  roleOptions.value = value
}

export const getDeptOptions = async function(deptId) {
  // const res = await getDeptTreeById(deptId)
  // departmentOptions.value = res.data
}

